<%@page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="html" tagdir="/WEB-INF/tags" %>
<!DOCTYPE html>
<html>
<html:header title="条码对照表">


    <style media="print">
        @page {
            margin: 0mm; /* this affects the margin in the printer settings */
            size: landscape;
        }
    </style>

    <script>
        function printPage(data){
            let child = "";
            let index = 0;
            $.each(data, function (i,goodsVo) {
                if (!emptyEntity(goodsVo.goodsUnitVoList[0].code)) {
                    child += "<div class='codeDiv' style='float: left;padding: 20px 20px 0px 20px;'>\n" +
                        "    <canvas code='"+goodsVo.goodsUnitVoList[0].code+"' class='barcode' style='width: 200px;height: 100px;'/>\n" +
                        "    <p style='text-align: center;width: 200px;'>条码:"+goodsVo.goodsUnitVoList[0].code+"</p>\n"+
                        "    <p style='text-align: center;width: 200px;'>名称:"+goodsVo.name+"</p>\n"+
                        "    <p style='text-align: center;width: 200px;'>编号:"+goodsVo.no+"</p>\n" +
                        "    <p style='text-align: center;width: 200px;'>单位:"+goodsVo.goodsUnitVoList[0].unit.name+"</p>\n" +
                        "</div>";
                    if ((index+1)%12 == 0) {
                        child += "<div style='page-break-after:always;'/><div style='padding-bottom:20px;'/>";
                    }
                    index++;
                }
            });
            $("#codeDiv").empty();
            $("#codeDiv").append(child);

            console.log("codeDiv:"+ $(".codeDiv").width());
            console.log("window:"+ $(window).width());

            $('.barcode').each(function () {
                $(this).JsBarcode($(this).attr("code"));
            });

            setTimeout(function () {
                window.print();
            },100);
        }
    </script>

</html:header>
<body>
<div style="padding: 40px 20px 0 20px;">
        <h2 style="width: 100%;text-align: center;">
            条码对照表
        </h2>

        <div style="overflow: hidden;" id="codeDiv">
        </div>
</div>

</body>

</html>